import React from 'react';
import PropTypes from 'prop-types';
import cn from 'classnames';
import { Tooltip, Button, Popover } from 'antd';
import _ from 'lodash';
import moment from 'moment';
import DeleteIcon from '../../images/delete.svg';
import CancelImg from '../../images/cancel.svg';
import StartIcon from '../../images/start.svg';
import StopIcon from '../../images/stop.svg';
import PausedIcon from '../../images/paused.svg';
import ReDetectIcon from '../../images/reDetect.svg';
import ExportIcon from '../../images/export.svg';
import DisableReDetectIcon from '../../images/disabled-reDetect.svg';
import './index.less';

const Operator = props => {
  const { row = {}, status, setMoreModalType, disabled = false } = props;
  const { scanType, enableRestart } = row;

  const notAllowType = ['Zoomeye', 'Web', 'Honeypot', 'VulDetect'];
  let disableReDetection = false;
  let more;

  if (notAllowType.includes(scanType)) {
    const lastStart = _.get(row, 'timing.endAt');
    const noRestart = _.get(row, 'timing.endAt') && moment().unix() > moment(lastStart).unix();
    disableReDetection = _.get(row, 'isCycle') || noRestart;
  } else {
    const lastStart = _.get(row, 'timing.endAt');
    disableReDetection = moment().unix() > moment(lastStart).unix();
  }

  function wrapSetMoreModal(type) {
    return () => setMoreModalType(type);
  }

  if (status === 'processing') {
    more = [
      <Button
        className="paused transparentColor"
        type="link"
        onClick={wrapSetMoreModal('paused')}
        key="0"
      >
        <Popover placement="top" content={'暂停'}>
          <img src={PausedIcon} />
        </Popover>
      </Button>,
      <Button
        className="stop transparentColor"
        type="link"
        onClick={wrapSetMoreModal('stop')}
        key="1"
      >
        <Popover placement="top" content={'终止'}>
          <img src={StopIcon} />
        </Popover>
      </Button>,
      <Button
        className="delete transparentColor"
        type="link"
        onClick={wrapSetMoreModal('delete')}
        key="2"
      >
        <Popover placement="top" content={'删除'}>
          <img src={DeleteIcon} />
        </Popover>
      </Button>
    ];
  } else if (status === 'finished') {
    let restart =
      scanType === 'OneDay' && !enableRestart ? (
        <Tooltip title="探测目标已被删除或曾被设置为白名单，扫描任务不能下发">
          <Button className="restart transparentColor" key="2" type="link">
            <Popover placement="top" content={'复测'}>
              <img src={DisableReDetectIcon} />
            </Popover>
          </Button>
        </Tooltip>
      ) : disableReDetection ? (
        <span className="restart" key="2">
          <Popover placement="top" content={'复测'}>
            <img src={DisableReDetectIcon} />
          </Popover>
        </span>
      ) : (
        <Button
          type="link"
          className={disableReDetection ? 'disabled' : 'restart'}
          onClick={wrapSetMoreModal('reDetect')}
          key="2"
        >
          <Popover placement="top" content={'复测'}>
            <img src={ReDetectIcon} />
          </Popover>
        </Button>
      );
    more = [
      restart,
      <Button
        className="export transparentColor"
        onClick={wrapSetMoreModal('export')}
        key="3"
        type="link"
      >
        <Popover placement="top" content={'导出报告'}>
          <img src={ExportIcon} />
        </Popover>
      </Button>,
      <Button
        className="delete transparentColor"
        onClick={wrapSetMoreModal('delete')}
        key="4"
        type="link"
      >
        <Popover placement="top" content={'删除'}>
          <img src={DeleteIcon} />
        </Popover>
      </Button>
    ];
  } else {
    let enableStart = _.get(row, 'status') === 'paused';
    let enableWaiting = _.get(row, 'status') === 'waiting';
    more = [
      <Button
        className="cancel transparentColor"
        onClick={wrapSetMoreModal('cancel')}
        key="0"
        type="link"
      >
        <Popover placement="top" content={'取消'}>
          <img src={CancelImg} />
        </Popover>
      </Button>,
      <Button
        className="delete transparentColor"
        onClick={wrapSetMoreModal('delete')}
        key="1"
        type="link"
      >
        <Popover placement="top" content={'删除'}>
          <img src={DeleteIcon} />
        </Popover>
      </Button>
    ];
    if (enableStart) {
      more.unshift(
        <Button
          className="start transparentColor"
          onClick={wrapSetMoreModal('resume')}
          key="0"
          type="link"
        >
          <Popover placement="top" content={'启动'}>
            <img src={StartIcon} />
          </Popover>
        </Button>
      );
    }
    if (enableWaiting) {
      more.shift();
    }
  }

  const res = <div className={cn('tm-operator')}>{!disabled && more}</div>;
  return res;
};

Operator.propTypes = {
  status: PropTypes.string,
  row: PropTypes.object,
  setMoreModalType: PropTypes.func,
  disabled: PropTypes.bool
};

export default Operator;
